<template>
	<view>
		<view class="top" :style="{paddingTop:height}">
			<view class="top__title">
				<image src="/static/Vector.png" class="top__title__icon" v-if="isback" mode="" @click="back"></image>
				{{title}}
			</view>
			<view class="top__tip" v-if="tip">
				{{tip}}
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props:{
			title:String,
			isback:Boolean,
			tip:String
		},
		name:"navbar",
		data() {
			return {
				
			};
		},
		computed: {
			height() {
				const height = `calc(${uni.$u.addUnit(uni.$u.sys().statusBarHeight, 'px')})`
				return uni.$u.deepMerge(height)
			},
			bheight() {
				const height = uni.$u.addUnit(uni.$u.sys().safeAreaInsets.bottom, 'px');
				return uni.$u.deepMerge(height)
			},
		},
	}
</script>

<style lang="scss">
.top{
	padding:0 28rpx;
	&__title{
		display: flex;
		align-items: center;
		height: 44px;
		font-family: Alimama ShuHeiTi, Alimama ShuHeiTi;
		font-weight: bold;
		font-size: 46rpx;
		color: #000000;
		&__icon{
			width: 20.99rpx;
			height: 36.26rpx;
			margin-right: 15rpx;
		}
	}
	&__tip{
		font-family: PingFang SC, PingFang SC;
		font-weight: 500;
		font-size: 27rpx;
		color: #878787;
		line-height: 40rpx;
		padding-bottom: 24rpx;
	}
}
</style>